// capacity
import "@/style/page/index.scss";
import { Button, Col, Row, Flex, Typography } from "antd";
const { Paragraph } = Typography;

const dataList = [
    {
        title: "智慧城市",
        img: require("@/assets/index/capacity_01.png"),
        content:
            "这是一条简介这是一条简介这是一条简介这是一条简介这是一条简介这是一条简介这是一条简介这是一条简介",
    },
    {
        title: "智慧安防",
        img: require("@/assets/index/capacity_02.png"),
        content: "10年+大厂开发经验，技术更强硬",
    },
    {
        title: "智慧工厂",
        img: require("@/assets/index/capacity_03.png"),
        content: "10年+大厂开发经验，技术更强硬",
    },
    {
        title: "智慧物联",
        img: require("@/assets/index/capacity_04.png"),
        content: "10年+大厂开发经验，技术更强硬",
    },
    {
        title: "数字孪生",
        img: require("@/assets/index/capacity_05.png"),
        content:
            "这是一条简介这是一条简介这是一条简介这是一条简介这是一条简介这是一条简介这是一条简介这是一条简介",
    },
    {
        title: "智慧门店",
        img: require("@/assets/index/capacity_06.png"),
        content: "10年+大厂开发经验，技术更强硬",
    },
    {
        title: "APP/小程序",
        img: require("@/assets/index/capacity_07.png"),
        content: "10年+大厂开发经验，技术更强硬",
    },
    {
        title: "自助建站",
        img: require("@/assets/index/capacity_08.png"),
        content: "10年+大厂开发经验，技术更强硬",
    },
    {
        title: "数据治理",
        img: require("@/assets/index/capacity_09.png"),
        content: "10年+大厂开发经验，技术更强硬",
    },
    {
        title: "融合赋能",
        img: require("@/assets/index/capacity_10.png"),
        content: "10年+大厂开发经验，技术更强硬",
    },
];
function Capacity(props) {
    return (
        <div className="Capacity">
            <div className="CapacityContent">
                <div className="CapacityContentDiv">
                    {dataList.map((item, index) => (
                        <div className="item" key={"capacity_item" + index}>
                            <Flex
                                className="item-flex"
                                justify="center"
                                align="center"
                            >
                                <Flex
                                    vertical
                                    align="flex-center"
                                    justify="center"
                                >
                                    <img
                                        alt="avatar"
                                        src={item.img}
                                        className="itemIcon"
                                    />
                                    <Typography.Title level={3}>
                                        {item.title}
                                    </Typography.Title>
                                </Flex>
                            </Flex>
                        </div>
                    ))}
                </div>
                {/* <Row gutter={[16, 16]}>
                    {dataList.map((item, index) => (
                        <Col span={4} key={"capacity_item" + index}>
                            <Flex
                                className="item"
                                justify="center"
                                align="center"
                            >
                                <Flex
                                    vertical
                                    align="flex-center"
                                    justify="center"
                                >
                                    <img
                                        alt="avatar"
                                        src={item.img}
                                        className="itemIcon"
                                    />
                                    <Typography.Title level={3}>
                                        {item.title}
                                    </Typography.Title>
                                </Flex>
                            </Flex>
                        </Col>
                    ))}
                </Row> */}
            </div>
        </div>
    );
}

export default Capacity;
